<div class="banner-box">
	<ul class="banner-list">
		##for( var i=0;i<bannerArr.length;i++ ){##
			<li><img src="{{bannerArr[i].img}}" alt=""></li>
		##}##
	</ul>
	<div class="banner-point">
		##for( var i=0;i<bannerArr.length;i++ ){##
			<span></span>
		##}##
	</div>
	<section class="cat-section container clear">
		<div class="cat-left">
			<div class="cat-left-item">
				<p class="item-title">
					<span class="icon around-icon"></span>
					<span>周边活动</span>
					<span class="arrow"></span>
				</p>
				<p class="item-con">
					<span>坝上草原</span>
					<span>葫芦岛</span>
					<span>乌兰布统(草原)</span>
				</p>
			</div>
			<div class="cat-left-item">
				<p class="item-title">
					<span class="icon internal-icon"></span>
					<span>国内活动</span>
					<span class="arrow"></span>
				</p>
				<p class="item-con">
					<span>五台山</span>
					<span>呼伦贝尔</span>
					<span>青海湖</span>
					<span>喀纳斯</span>
				</p>
			</div>	
			<div class="cat-left-item">
				<p class="item-title">
					<span class="icon abroad-icon"></span>
					<span>出境活动</span>
					<span class="arrow"></span>
				</p>
				<p class="item-con">
					<span>柬埔寨</span>
					<span>不丹</span>
					<span>尼泊尔</span>
					<span>斯里兰卡</span>
				</p>
			</div>
			<div class="cat-left-item">
				<p class="item-title">
					<span class="icon outdoor-icon"></span>
					<span>户外活动</span>
					<span class="arrow"></span>
				</p>
				<p class="item-con">
					<span>摄影</span>
					<span>登山</span>
					<span>溯溪</span>
					<span>宿营</span>
					<span>骑行</span>
				</p>
			</div>
		</div>
		<div class="cat-right">
			<div class="cat-right-item">
				<div class="item-group">
					<h1 class="item-title">周边活动</h1>
					<div class="item-con">
						<a href="#">密云</a>
						<a href="#">怀柔</a>
						<a href="#">天津</a>
						<a href="#">坝上草原</a>
						<a href="#">保定</a>
						<a href="#">葫芦岛</a>
						<a href="#">河北</a>
						<a href="#">乌兰布统(草原)</a>
					</div>
				</div>
				<div class="item-group">
					<h1 class="item-title">热门活动</h1>
					<div class="item-img">
						<a href="#">
							<img src="static/images/cat-img1.jpg" alt="">
							<span class="top">TOP1</span>
						</a>
						<a href="#">
							<img src="static/images/cat-img2.jpg" alt="">
							<span class="top">TOP2</span>
						</a>
						<a href="#">
							<img src="static/images/cat-img3.jpg" alt="">
							<span class="top">TOP3</span>
						</a>
					</div>
				</div>
			</div>
			<div class="cat-right-item">
				<div class="item-group">
					<h1 class="item-title">云南</h1>
					<div class="item-con">
						<a href="#">西双版纳</a>
						<a href="#">香格里拉</a>
						<a href="#">腾冲</a>
						<a href="#">昆明</a>
						<a href="#">普者黑</a>
					</div>
				</div>
				<div class="item-group">
					<h1 class="item-title">西藏</h1>
					<div class="item-con">
						<a href="#">拉萨</a>
						<a href="#">布达拉宫</a>
						<a href="#">纳木措</a>
						<a href="#">珠峰大本营</a>
					</div>
				</div>
				<div class="item-group">
					<h1 class="item-title">内蒙古</h1>
					<div class="item-con">
						<a href="#">呼伦贝尔</a>
						<a href="#">呼和浩特</a>
						<a href="#">包头</a>
						<a href="#">鄂尔多斯</a>
					</div>
				</div>
			</div>
			<div class="cat-right-item">
				<div class="item-group">
					<h1 class="item-title">东南亚</h1>
					<div class="item-con">
						<a href="#">巴厘岛</a>
						<a href="#">柬埔寨</a>
						<a href="#">马来西亚</a>
						<a href="#">越南</a>
						<a href="#">印尼</a>
						<a href="#">诗巴丹</a>
					</div>
				</div>
				<div class="item-group">
					<h1 class="item-title">南亚</h1>
					<div class="item-con">
						<a href="#">不丹</a>
						<a href="#">尼泊尔</a>
						<a href="#">斯里兰卡</a>
					</div>
				</div>
				<div class="item-group">
					<h1 class="item-title">热门活动</h1>
					<div class="item-img">
						<a href="#">
							<img src="static/images/cat-img1.jpg" alt="">
							<span class="top">TOP1</span>
						</a>
						<a href="#">
							<img src="static/images/cat-img2.jpg" alt="">
							<span class="top">TOP2</span>
						</a>
						<a href="#">
							<img src="static/images/cat-img3.jpg" alt="">
							<span class="top">TOP3</span>
						</a>
					</div>
				</div>
			</div>
			<div class="cat-right-item" style="z-index:1">
				<div class="item-group">
					<div class="item-outing">
						<a href="#"><img src="static/images/outing/cat1.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat2.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat3.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat4.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat5.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat6.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat7.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat8.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat9.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat10.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat11.png" alt=""></a>
						<a href="#"><img src="static/images/outing/cat12.png" alt=""></a>
					</div>
				</div>
			</div>
		</div>
	</section>
</div>
<div class="main container">
	<div class="item-group">
		<div class="item-top">
			<div class="item-title">
				<div class="item-title-con">
					<i class="left-hr"></i>
					心之所向 身之所往
					<i class="right-hr"></i>
				</div>
			</div>
			<p>用旅行的感动，铺满整个季节</p>
		</div>
		<ul class="item-list clear">
			##for( var i=0;i<listArr.length;i++ ){##
				<li>
					<a href="list.html">
						<span class="item-icon"><img src="{{listArr[i].itemIcon}}" alt=""></span>
						<span class="item-txt">{{listArr[i].itemTxt}}</span>
						<img class="item-bg" src="{{listArr[i].itemBg}}" alt="">
					</a>
				</li>
			##}##
		</ul>
	</div>
	<div class="item-group">
		<div class="item-top">
			<div class="item-title">
				<div class="item-title-con">
					<i class="left-hr"></i>
					周末好去处
					<i class="right-hr"></i>
				</div>
			</div>
			<p>若生命只有两天，第一天享受快乐，第二天留住感动</p>
		</div>
		<ul class="item-week clear">
			##for( var i=0;i<weekArr.length;i++ ){##
				<li class="item clear">
					<div class="pic">
						<a href="#"><img src="{{weekArr[i].img}}" alt=""></a>
						<div class="pic-type">{{weekArr[i].type}}</div>
					</div>
					<div class="info">
						<a class="info-title" href="#">{{weekArr[i].title}}</a>
						<div class="info-base">
							<span class="time"><i class="icon icon-cal"></i>{{weekArr[i].time}}</span>
							<span class="place"><i class="icon icon-site"></i>{{weekArr[i].place}}</span>
						</div>
						<div class="strbox">
							<span class="str">强度：</span>
							<i class="active"></i>
							<i></i>
							<i></i>
							<i></i>
							<i></i>
							<span class="price"><em>{{weekArr[i].price}}</em>起</span>
						</div>
					</div>
				</li>
			##}##
			<li class="week-more">
				<a class="more" href="#">查看更多周末线路产品<i class="icon-more"></i></a>
			</li>
		</ul>
	</div>
	<div class="item-group">
		<div class="item-top">
			<div class="item-title">
				<div class="item-title-con">
					<i class="left-hr"></i>
					一起出发吧
					<i class="right-hr"></i>
				</div>
			</div>
			<p>几张旧纸，笔尖轻触，如花开一瞬，却映半生繁华。</p>
		</div>
		<div class="item-box clear">
			##for( var i=0;i<contentArr.length;i++ ){##
				<div class="item">
					<div class="item-content">
						<img class="item-img" src="{{contentArr[i].itemBg}}" alt="">
						<span class="type sy">{{contentArr[i].type}}</span>
						<div class="intro">
							<img src="static/images/article-icon2.png" alt="">
							<p class="title">{{contentArr[i].title}}</p>
							<p class="look">浏览量：<span>{{contentArr[i].look}}</span></p>
						</div>
					</div>
					<div class="pop">
						<a class="pop-box" href="detail.html">
							<h2 class="pop-title">{{contentArr[i].title}}</h2>
							<p class="look">浏览量：<span>{{contentArr[i].look}}</span></p>
							<p class="pop-con">{{contentArr[i].popCon}}</p>
							<div class="pop-footer">
								<div class="pop-footer-box">
									<a class="icon first" href="#"></a>
									<a class="icon qq" href="#"></a>
									<a class="icon weixin" href="#"></a>
									<a class="icon xinlang" href="#"></a>
									<a class="more-txt" href="#">更多>></a>
								</div>	
							</div>
						</a>	
					</div>
				</div>
			##}##
		</div>
	</div>
	<div class="us container">
		<ul class="clear">
			<li class="width0">
				<h1 class="us-title"><i class="icon-product"></i>我们的产品</h1>
				<div class="us-product">
					<a href="#">深旅行</a>
					<a href="#">去探索</a>
					<a href="#">新体验</a>
					<a href="#">重发现</a>
					<a href="#">有温度</a>
					<a href="#">乐分享</a>
				</div>
			</li>
			<li class="width1">
				<h1 class="us-title"><i class="icon-service"></i>我们的服务</h1>
				<div class="us-service">
					<p>专业的户外保障，完善的售前售后服务</p>
					<p>户外达人的社交圈子</p>
				</div>
			</li>
			<li class="width2">
				<h1 class="us-title"><i class="icon-area"></i>爱游区域</h1>
				<div class="us-area">
					<span>地方分站覆盖至北上广</span>
					<span>10,000+　专业领队</span>
					<span>4,000,000+　用户覆盖</span>
					<span>1,000+　国内外户外路线</span>
				</div>
			</li>
		</ul>
	</div>
</div>